import {useRef} from 'react';
import {UserAPI} from '@/utils'
import {useNavigate} from 'umi';
function UserAdd(){
    const navigate = useNavigate();
    const usernameRef = useRef();
    const handleSubmit = (event)=>{
        //阻止默认事件，不然页面会刷新
        event.preventDefault();
        //通过用户名输入框的ref获取 输入框的值
        let username  = usernameRef.current.value;
        //创建一个新的用户对象
        let user = {username}
        //把此新的用户对象添加到数组中，然后保存到localStorage里
        UserAPI.add(user);
        //跳转到用户列表页
        navigate('/user/list');
    }
    return (
       <form onSubmit={handleSubmit}>
        用户名:<input ref={usernameRef}/>
        <input type="submit"/>
       </form>
    )
}
export default UserAdd;